<template>
	<view class="index-home-main">
		<swiper
			class="swiper"
			indicator-dots="true"
			autoplay="true"
			interval="3000"
			duration="1000"
			style="padding: 5px 20px;height: 130px;"
		>
			<swiper-item style="background: #f66;border-radius: 8px;">
				<image
					style="width: 100%;height: 100%;"
					src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1548848984782&di=9b24016b0e3e0aca79cdd69810e4754e&imgtype=0&src=http%3A%2F%2Fpic2.ooopic.com%2F12%2F40%2F58%2F18bOOOPIC9c.jpg"
				></image>
			</swiper-item>
			<swiper-item style="background: #6666FF;border-radius: 8px;">
				<image
					style="width: 100%;height: 100%;"
					src="http://img1.imgtn.bdimg.com/it/u=2502073311,3044549660&fm=26&gp=0.jpg"
				></image>
			</swiper-item>
			<swiper-item style="background: #99CCFF;border-radius: 8px;">
				<image
					style="width: 100%;height: 100%;"
					src="http://wx1.sinaimg.cn/large/c37706d6ly1fl45aotn6jj20dw0dw405.jpg"
				></image>
			</swiper-item>
		</swiper>

		<view class="all-title"> 全部功能 </view>
		<view class="ui-flex title-box">
			<view class="title-item " :class="{ active: indexHomeType == 0 }" @tap="titleTap(0)"
				>日记</view
			>
			<view class="title-item" :class="{ active: indexHomeType == 1 }" @tap="titleTap(1)"
				>记账</view
			>
			<view class="title-item" :class="{ active: indexHomeType == 2 }" @tap="titleTap(2)"
				>其他</view
			>
		</view>
		<view class="item-box" v-show="indexHomeType == 0" style="background: #ffff33;" @tap="go('/pages/diary/diary')">我的日记</view>
		<view class="item-box" v-show="indexHomeType == 0" style="background: #ff6633;" @tap="go('/pages/diary/diary?type=1')">朋友日记</view>
		<view class="item-box" v-show="indexHomeType == 0" style="background: #99ccff;" @tap="go('/pages/diary-add/diary-add')">新日记</view>
		<view class="item-box" v-show="indexHomeType == 0" style="background: #99ff33;" @tap="go('/pages/diary-privilege/diary-privilege')">日记授权</view>
		<view class="item-box" v-show="indexHomeType == 1" style="background: #33ff00;" @tap="go('/pages/account/account')">
			记账本
		</view>
		<view class="item-box" v-show="indexHomeType == 1" style="background:#ffccff" @tap="go('/pages/account-add/account-add')">
			快速记账
		</view>
		<view class="item-box" v-show="indexHomeType == 2" style="background: #dd524d;">敬请期待</view>
		
		<view style="height: 50px;"></view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			indexHomeType: 0
		};
	},
	methods: {
		titleTap(index) {
			this.indexHomeType = index;
		},
		go(path) {
			uni.navigateTo({
				url: path
			});
		}
	}
};
</script>

<style lang="scss">
.index-home-main {
	background: #fff;
	.all-title {
		padding: 10px 20px;
		font-size: 20px;
		color: #333;
		font-weight: 600;
	}
	.title-box {
		padding: 0 20px;
		font-size: 16px;
		margin-bottom: 20px;
		color: #999;
		.title-item {
			margin-right: 20px;
			padding: 7px 3px;
			&.active {
				color: #333;
				border-bottom: 3px solid #007aff;
			}
		}
	}
	.item-box {
		margin: 20px;
		height: 120px;
		padding: 20px;
		box-sizing: border-box;
		color: #333;
		background: #007aff;
		border-radius: 8px;
	}
}
</style>
